/*
 * @Author: Swance
 * @Date: 2023-12-14
 * @Description: 创建fabric.Canvas对象的工厂Hook
 */
import { fabric } from 'fabric';
export const useCreateCanvas = function () {
  fabric.Object.prototype.padding = 5;
  fabric.Object.prototype.controls.mtr.withConnection = false;
  fabric.Object.prototype.borderColor = 'rgb(85, 113, 254)';
  fabric.Object.prototype.cornerStyle = 'circle';
  fabric.Object.prototype.cornerColor = 'white';
  fabric.Object.prototype.cornerStrokeColor = 'rgb(85, 113, 254)';
  fabric.Object.prototype.cornerSize = 10;
  fabric.Object.prototype.controls.mtr.cursorStyle = 'pointer';
  fabric.Object.prototype.controls.mtr.offsetY = -18;
  fabric.Object.prototype.transparentCorners = false;

  const canvas = new fabric.Canvas('canvas', {
    fireRightClick: true, // 启用右键，button的数字为3
    stopContextMenu: true, // 禁止默认右键菜单
    selectionBorderColor: 'rgb(78,148,255)',
    selectionColor: 'transparent',
  });
  const ctx = canvas?.getContext();
  ctx.canvas.willReadFrequently = true;
  return canvas;
};
